<template>
<view class="wen">
	<view style="background: #F1F2e5; margin-bottom:15rpx;width: 100%;height: 1rpx;"></view>
	<!-- 正在拍卖 -->
		<view class="hot_goods" @click="toxiangqing(item.id)" v-for="item in goods" :key="item.id">
			<view class="goods_list">
			<u--image :showLoading="true" :src="item.imgId" width="100%" height="380rpx" ></u--image>
			<view style="height: 30px;width: 220px;background-color: rgba(237, 113, 110, 0.7);position:relative; top: -30px;border-radius: 10rpx;">
				<u-row >
					<u-col style="color: white;" span=7>
						剩余拍卖时间:
					</u-col>
					<u-col span=6>
						<u-count-down :time="new Date(item.endTime).getTime() - new Date().getTime()  " format="DD天 HH:mm:ss"></u-count-down>
					</u-col>
				</u-row>

			</view>
			<u-row style="margin-top: -30px;" class="price"> 
			<u-col span="9">
				<text style="margin-left:5px;"> {{item.goodsName}}</text> <!-- 拍卖名称 -->
			</u-col>
			<u-col class="goprice" span=3 >
				  去出价>
			</u-col>
			</u-row>
			<view class="name">
				 <text>当前竞拍价: ￥{{item.startPrice}}</text>   <!-- 当前竞拍价 -->
				 <text>起拍价: ￥{{item.startPrice}}</text>  <!-- 起拍价 -->
			</view>
			</view>
			</view>
			<view style="background-color:#F1F2e5;height: 40px;">
		</view>	
</view>
</template>

<script>
	export default {
			data() {
				return {
					goods:[],
					src: 'http://dongdongoss.oss-cn-beijing.aliyuncs.com/fff3ccdc-9127-4303-a8c7-c5fbf212bdc5u%3D3727915374%2C2341177956%26fm%3D253%26fmt%3Dauto%26app%3D138%26f%3DJPEG.webp',
                    src1: 'http://dongdongoss.oss-cn-beijing.aliyuncs.com/b5569eef-83cf-465b-856a-2d68b800cec3u%3D867145240%2C2464247544%26fm%3D253%26fmt%3Dauto%26app%3D138%26f%3DJPEG.webp',
				}
			},
			onLoad() {
				this.getHotGoods()
			},
			methods: {
				//单查
				toxiangqing(id){
				    uni.navigateTo({
				         url:'/pages/paiMaiXiangQing/paiMaiXiangQing?id='+id,
				    })
				},
				//获取推荐专区列表数据
				async getHotGoods () {
							const res = await this.$myRuquest({
								url: 'client/auction/getGoodsListNotPage?status=2'			
							})
							this.goods = res.data.obj
							this.goods.forEach(a => {
							a.imgId = 'http://101.43.223.224:8765/image/getImageById?id='+a.imgId.split(",")[0]
							})
							},
				
			},
			
			
		}
</script>

<style lang="scss" scoped>
	 .wen {
		 width: 100%;
		 height: 100%;
		 background-color: #F1F2e5;
		}
		.hot_goods {
			border-radius: 20rpx;
			background:  white;
			overflow: hidden;
			margin-top: 30px;
			margin-bottom: 20px;
			margin-left: 25px;
			margin-right: 25px;
	 .goods_list{
			padding: 0 7rpx;
			flex-wrap: wrap;
			justify-content: space-between;   
	  
	 }
	 
	 
	 .price{
	 	color: #6B4226;
	 	font-size: 36rpx;
	 	margin: 15rpx 0 1rpx 0;
		.goprice{
			color:red;
			font-size: 36rpx;
			margin-top: 15rpx;
		}
		}
	 .name {

		 	color: red;
		 	font-size: 38rpx;
		 	margin-left: 10rpx;
		text:nth-child(2){
	 	color: grey;
	 	font-size: 30rpx;
	 	line-height: 70rpx;
		margin-left: 50rpx;
		}
	 }
	 }
	 .u-count-down /deep/  .u-count-down__text{
		 color:white;
	 }
</style>